<template>
    <div>
        <ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media" v-for="item in list" :key="item.id">
					<router-link :to="'/home/newsList/' + item.id">
						<img class="mui-media-object mui-pull-left" :src=item.url>
						<div class="mui-media-body">
							<h1>{{item.id}}.{{item.title}}</h1>
                            <p class='mui-ellipsis'>
							<span>评论时间：{{item.addedTime | formatTime('YYYY-MM-DD')}}</span>
                            <span>点击：{{item.click}}</span>
                            </p>
						</div>
					</router-link>
				</li>
		</ul>
    </div>
</template>
<script>
import { Toast } from 'mint-ui';
// import moment from 'moment';
export default {
    data:function(){
        return{
            list:[],
        }
    },
    methods:{
        getNewsList : function () {
            this.$http.get('lib/interface2.json').then(function(res){
                    console.log(res.body); 
                    if(res.body.status == "ok"){
                        this.list = res.body.newslist;
                        Toast({
                            message:"加载新闻列表成功",
                            position: 'bottom',
                            duration: 2000
                            });
                    }else{
                        console.error('加载新闻列表失败!');
                    }
                },function(){
                    console.log('请求失败处理');
                });
        }
    },
    // filters:{
    //     formatTime:function (msg,arg) {
    //         return momment(msg).format(arg);
    //         // var dt = new Date(msg);
	// 		// var Y = dt.getFullYear();
	// 		// //padStart能填充字符串，第一个参数为想要的字符长度，第二个参数为填充的字符
	// 		// var M = (dt.getMonth() + 1).toString().padStart(2,'0');
	// 		// var D = dt.getDate().toString().padStart(2,'0');;
	// 		// if (arg && arg.toLowerCase() == 'yyyy-mm-dd') {
	// 		// 	return `${Y}-${M}-${D}`;
	// 		// }else{
	// 		// 	var H = dt.getHours().toString().padStart(2,'0');;
	// 		// 	var m = dt.getMinutes().toString().padStart(2,'0');;
	// 		// 	var S = dt.getSeconds().toString().padStart(2,'0');;
	// 		// 	return `${Y}-${M}-${D} ${H}:${m}:${S}`;
	// 		// }
    //     }
    // },
    created:function () {
        this.getNewsList();
    }
}
</script>
<style lang="scss" scoped>
.mui-media-body{
    h1{
        margin-top: 0px;
        font-size: 14px;
    }
    .mui-ellipsis {
        display: flex;
        justify-content: space-between;
    }
    p{
        color: #539dee;
        font-size: 12px;
    }
}
</style>